import 'package:flutter/material.dart';

class Widget_Form_Page extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return Widget_Form_State();
  }
}

class Widget_Form_State extends State<Widget_Form_Page> {

  //全局key用来获取Form表单组件
  GlobalKey<FormState> _globalKey = GlobalKey();
  String name;
  String passWord;

  void dologin() {
    FormState formState = _globalKey.currentState;
    if (formState.validate()) {
      print("!!!!!!!!!!!!!!!! formState.save()前");
      formState.save();
      print("!!!!!!!!!!!!!!!! formState.save()后");
    }
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("Form"),
        ),
        body: Container(
          padding: EdgeInsets.all(12.0),
          color: Color(0xfff1f1f1),
          child: Form(
            key: _globalKey,
            child: Column(
              children: <Widget>[
                TextFormField(
                  decoration: InputDecoration(
                      labelText: "请输入用户名",
                      labelStyle: TextStyle(
                          color: Colors.green,
                          fontSize: 20.0
                      )
                  ),
                  onSaved: (value) { //formState.save()方法执行完之后执行onSaved方法
                    print("!!!!!!!!!!!!!!!! onSaved");
                    name = value;
                  },
                  onFieldSubmitted: (value) {
                    print("!!!!!!!!!!!!!!!! onFieldSubmitted:$value");
                  },
                  onEditingComplete: () {
                    print("!!!!!!!!!!!!!!!! onEditingComplete");
                  },
                ),
                TextFormField(
                  decoration: InputDecoration(
                      labelText: "请输入密码"
                  ),
                  onSaved: (value) {
                    passWord = value;
                  },
                  obscureText: true,
                  autovalidate: true,
                  validator: (value) {
                    return value.length < 4 ? "密码长度不够4位" : null;
                  },
                ),
                Container(
                  margin: EdgeInsets.only(top: 20.0),
                  width: 200,
                  height: 40,
                  child: RaisedButton(
                    onPressed: dologin,
                    child: Text("登录"),
                  ),
                )
              ],
            ),
          ),
        ),
      ),
    );
  }
}

/**
 * 表单
 *
 * const Form({
    Key key,
    @required this.child,
    this.autovalidate = false,//是否自动提交表单
    this.onWillPop,
    this.onChanged,//当FormFiled值改变时的回调函数
    })
 */

/**
 * 大部分属性同TextFiled
 *
 * TextFormField({
    Key key,
    this.controller,//控制正在编辑的文本。如果为空，这个小部件将创建自己的TextEditingController并使用initialValue初始化它的TextEditingController.text
    String initialValue,//初始值
    FocusNode focusNode,
    InputDecoration decoration = const InputDecoration(),//输入器装饰
    TextInputType keyboardType,//弹出键盘的类型
    TextCapitalization textCapitalization = TextCapitalization.none,//户输入中的字母大写的选项,TextCapitalization.sentences每个句子的首字母大写,TextCapitalization.characters:句子中的所有字符都大写，TextCapitalization.words : 将每个单词的首字母大写。
    TextInputAction textInputAction,//更改TextField的textInputAction可以更改键盘右下角的操作按钮,搜索，完成
    TextStyle style,
    TextDirection textDirection,//文字显示方向
    TextAlign textAlign = TextAlign.start,//文字显示位置
    bool autofocus = false,//自动获取焦点
    bool obscureText = false,//是否隐藏输入，true密码样式显示，false明文显示
    bool autocorrect = true,
    bool autovalidate = false,//是否自动验证值
    bool maxLengthEnforced = true,
    int maxLines = 1,//编辑框最多显示行数
    int maxLength,//输入最大长度，并且默认情况下会将计数器添加到TextField
    VoidCallback onEditingComplete,//当用户提交时调用
    ValueChanged<String> onFieldSubmitted,
    FormFieldSetter<String> onSaved,//当Form表单调用保存方法save时回调
    FormFieldValidator<String> validator,//Form表单验证
    List<TextInputFormatter> inputFormatters,
    bool enabled = true,
    Brightness keyboardAppearance,
    EdgeInsets scrollPadding = const EdgeInsets.all(20.0),
    bool enableInteractiveSelection = true,
    })
 */
